@extends('home.layout')
@section('content')
<script type="text/javascript">
	$(function(){
		$("#footer").css('display','none');
	});
</script>

<link rel="stylesheet" href="/home/css/xl_pay.css">
<link rel="stylesheet" href="/home/css/main.css">
<script type="text/javascript">
window.habo_aid = 'vippaypop';
window.actid = 'vippaypop';

//配置显示
</script>

<body>
<!-- 微信扫码 -->
<div class="xl_pop_pay pop_xlvip" id="xl_pop_pay">
    <div class="pay_load" style="display: none;">
		
		<p>页面加载中...</p>
	</div>

   <div id="paycontent" style="">
	 <div class="pay_user" id="user-info">
<a href="javascript:void(0)" class="pay_user_des">
	<span class="pay_user_pic"> <i class="pay_user_mask"></i>
		<img src="http://img.ucenter.xunlei.com/usrimg/175988747/100x100">
	</span>
	<span class="pay_user_name">雪绵羊</span> <i class="icvip icvip00hui"></i>
</a>
<span class="pay_expire">会员有效期：无</span></div>
	<div class="pay_main">
<!-- 开通服务 -->
<div class="pay_box" id="open-type-div">
<span class="pay_box_tit">开通</span>
<div class="pay_type">
	<ul id="cate" style="">
		
	   	
	   
	   <li style="" class="" vip-type="3" op-type="1">
			<a id="bvip" href="javascript:void(0)" clickid="v_pc_minipay_baijin">白金会员</a> 
		</li>
	   	

	   
	   <li vip-type="5" op-type="1" class="">
			<a id="svip" href="javascript:void(0)" clickid="v_pc_minipay_chaoji">超级会员</a>
			<span class="type_new">NEW</span>
		</li>
	   	
	  
	</ul>
</div>

<p style="" class="type_des" id="tip-describe" style="">超级会员尊享白金会员+快鸟会员+网游加速器所有特权！</p>

</div>
	<div id="money-box">
<div class="pay_box ">
	<span class="pay_box_tit">时长</span>
	<div class="pay_time_list" id="pay-time-div">
		<ul id="select" class="fix">
            
			<li class="" data-month="12" data-way="no-monthly">
			<a href="javascript:void(0)" clickid="v_pc_minipay_taocan1">
				<p class="time">1年</p>
				<p id="a" index="0.8" m="12" class="average">27.4元/月</p>
				
					<span class="ico_label">荐</span>
				
				<i class="ico_p_cho"></i>
			</a>
			</li>
			
			<li class="" data-month="3" data-way="no-monthly">
			<a href="javascript:void(0)" clickid="v_pc_minipay_taocan2">
				<p class="time">3个月</p>
				<p id="b" index="0.9" m="3" class="average">28.0元/月</p>
				
				<i class="ico_p_cho"></i>
			</a>
			</li>
			
			<li class="" data-month="1" data-way="no-monthly">
			<a href="javascript:void(0)" clickid="v_pc_minipay_taocan3">
				<p class="time">1个月</p>
				<p id="c" index="1" m="1" class="average">30.0元/月</p>
				
				<i class="ico_p_cho"></i>
			</a>
			</li>
			
		</ul>


		<script type="text/javascript">
			$(function(){
				var d = 0;
				var type = '';
				//选择类别
				$("#cate li").on('click',function(){
					$("#cate li").attr('class','');
					$(this).attr('class','cho');
					type = $(this).find('a').html();
					var c = $("#select li").find("#c");
					var a = $("#select li").find("#a");
					var b = $("#select li").find("#b");
					$.ajax({
						type:'POST',
						url:"{{url('/home/vip/select')}}",
						data:{type:type},
						headers:{
	                    'X-CSRF-TOKEN': $('meta[name="_token"]').attr('content')
	                    },
						success:function(data)
						{

							a.html((data * 0.8 ) + '元/月');
							b.html((data * 0.9 ) + '元/月');
							c.html(data + '元/月');
							d = data;
						},
						error:function()
						{
							alert('异常');
						},
						dataType:'json'

					});
				});
				var m = 0;
				//选择时长
				$("#select li").on('click',function(){
					$("#select li").attr('class','');
					$(this).attr('class','cho');
					var res = $(this).find('.average').attr('index');
					m = $(this).find('.average').attr('m');
					var account = (d * res) * m;
					if(d)
					{
						$('#account').html(account);
					}else
					{
						alert('请选择会员类别');
					}
					
					
				});


				var num = 0;
				//提交数据
				$("#sure").on('click',function(){
					if(m != 0)
					{
						if($("#baby").attr('class') != 'cho')
						{
							alert('请确认支付方式');
						}else
						{
							$.ajax({
								type:'POST',
								url:"{{url('/home/vip/insert')}}",
								data:{m:m,type:type},
								headers:{
			                    'X-CSRF-TOKEN': $('meta[name="_token"]').attr('content')
			                    },
								success:function(data)
								{
									$("#confirmpop").css('display','block');
									$("#paycontent").css('display','none');
									num = data

								},
								error:function()
								{
									alert('异常');
								},
								dataType:'json'
							});
					}

				}else
				{
					alert('请选择开通时长');
				}
				});


			});
		</script>
		<div class="other_time">
			<span class="other_time_des" style="display:none">补齐<b class="fc_light">2</b>个月即可成为年费会员</span>
		</div>
	</div>
</div>


<div class="pay_box" id="totalmoney-div" style="">
	<span class="pay_box_tit">金额</span>
	<div class="vou_box fix">
		<p class="price_total fl"> <b id="account" class="num" id="account">0</b>
			元<span class="fc_gray" style="" id="money-tip"></span>
		</p>
		<div class="vouchers" style="display: none;">
			<span class="ico_chk checked"><i></i></span>
			<div class="drop_vou">
				<a href="javascript:;" class="sel"><span>10元代金券</span><i class="ico_arw"><b></b></i></a>
				<div class="drop_vou_list"></div>
			</div>
		</div>
	</div>
</div>
</div>

	<div class="pay_box pay-box mobile-charge-div month-div" style="display:none">
		<span class="pay_box_tit">实付金额</span>
		<p class="price_total" id="per-month"> <b class="num">15.0</b>
			元/月
		</p>
	</div>
		<!-- 支付方式 -->
		<div class="pay_box hidebox" id="select-pay-box" style="">
			<span class="pay_box_tit" id="pay-way-label">支付</span>
			<div class="pay_way">
				<div class="pay_way_list" id="open-way-div"><ul class="fix">

	 	<li id="baby" data-value="zfb" item="zfb-open" class="" paybtn="v_pc_minipay_zfbkt">
			<a clickid="v_pc_minipay_zfbao" href="javascript:void(0)">支付宝</a> <i class="ico_p_cho"></i>
		</li>
		<script type="text/javascript">
			$(function(){
				$("#baby").on('click',function(){
					$(this).attr('class','cho');
				});
			});
		</script>

</ul>
<div class="bank_list fix" id="bank-div" style="display:none">
	<a href="javascript:void(0)" data-value="ICBC" clickid="v_pc_minipay_gsyh">工商银行</a>
	<a href="javascript:void(0)" data-value="ABC" clickid="v_pc_minipay_nyyh">农业银行</a>
	<a href="javascript:void(0)" data-value="CMB" clickid="v_pc_minipay_zsyh">招商银行</a>
	<a href="javascript:void(0)" data-value="BOCB2C" clickid="v_pc_minipay_zgyh">中国银行</a>
	<a href="javascript:void(0)" data-value="CCB" clickid="v_pc_minipay_jsyh">建设银行</a>
	<a href="javascript:void(0)" data-value="NBBANK" clickid="v_pc_minipay_nbyh">宁波银行</a>
	<a href="javascript:void(0)" data-value="COMM" clickid="v_pc_minipay_jtyh">交通银行</a>
	<a href="javascript:void(0)" data-value="GDB" clickid="v_pc_minipay_gfyh">广发银行</a>
	<a href="javascript:void(0)" data-value="CMBC" clickid="v_pc_minipay_msyh">民生银行</a>
	<a href="javascript:void(0)" data-value="SPABANK" clickid="v_pc_minipay_payh">平安银行</a>
	<a href="javascript:void(0)" data-value="CEBBANK" clickid="v_pc_minipay_gdyh">光大银行</a>
	<a href="javascript:void(0)" data-value="" clickid="v_pc_minipay_qtyh">其它银行</a>
</div>
</div>



                <!--手机话费-->
                <div class="form_code pay-box mobile-charge-div" style="display:none">

                	<div class="form_code_box">
                		<label>手机号码</label>
                		<input id="mobile-phone" name="mobile-phone" class="ipt_code" value="" validchars="0123456789" tabindex="1" maxlength="11" type="text">
                		<a href="javascript:void(0)" class="get_code" id="get-code">获取验证码</a>
                		<!-- <a href="#" class="get_code reget">59s后重新获取</a> -->
                	</div>
                	<div class="form_code_box">
                		<label>验证码</label>
                		<input class="ipt_code" value="" name="mobile-verify-code" maxlength="6" onkeyup="value=value.replace(/[^\d|0]/g,'')" type="text">
                		<p class="pay_warn" id="mobile-verify-tip" style="visibility:hidden;">
                			<span class="ico_p_warn"></span>
                			<em>请输入11位手机号码</em>
                		</p>
                	</div>
                </div>
                <!--手机话费end-->

                <!--手机包月-->
                 <div class="form_code pay-box month-div" style="display:none">
  					<p class="phone_note">（开启每月自动扣除费用充值会员）</p>
                	<div class="form_code_box">
                		<label>手机号码</label>
                		<input id="month-phone" name="month-phone" class="ipt_code" value="" validchars="0123456789" tabindex="1" maxlength="11" type="text">
                		<a href="javascript:void(0)" class="get_code" id="month-get-code">获取验证码</a>
                		<!-- <a href="#" class="get_code reget">59s后重新获取</a> -->
                	</div>
                	<div class="form_code_box">
                		<label>验证码</label>
                		<input class="ipt_code" value="" name="month-verify-code" maxlength="6" onkeyup="value=value.replace(/[^\d|0]/g,'')" type="text">
                		<p class="pay_warn" id="month-verify-tip" style="visibility:hidden;">
                			<span class="ico_p_warn"></span>
                			<em>请输入11位手机号码</em>
                		</p>
                	</div>
                </div>

                <!--手机包月end-->

                <!--天宏一卡通-->
                <div class="form_code pay-box thcard-div" style="display:none;">
                	<div class="form_code_box">
                		<label>卡号</label>
                		<input class="ipt_code" name="card-account" value="" type="text">
                	</div>
                	<div class="form_code_box">
                		<label>密码</label>
                		<input class="ipt_code" name="card-password" value="请输入一卡通密码" type="text">
                	</div>
                	<div class="form_code_box" style="z-index: 8;">
                		<label>购买时长</label>
                		<div class="drop_list selected">
                			<a href="javascript:void(0)" class="sel_box" id="selected-type">
                				<span>30元，开通2个月 </span><i class="ico_p_more"></i>
                			</a>
                			<div class="drop_list_cho" id="onecard-drop">
                				<!-- <a href="#">15元，开通1个月</a>
                				<a href="#">30元，开通2个月</a> -->
                			</div>
                		</div>
                		<p class="pay_warn" id="wrong-onecard-tip" style="">
                			<span class="ico_p_warn"></span>
                			<em>请输入一卡通卡号</em>
                		</p>
                	</div>

					<script id="onecard-template" type="text/template">
						<% for(var i = 0,length = timeList.length ; i < length ; ++i){ %>
							<a href="javascript:void(0)" name="month-info" data-item="<%= timeList[i].month %>"><%= timeList[i].money %>元，开通<%= timeList[i].month %>个月</a>
						 <% } %>
					</script>

                </div>

                <!--手机充值卡-->
                <div class="form_code_box pay-box mobilecard-div" style="display:none;">

                       <label>充值卡</label>
                       <div class="pay_way_list" style="margin:20px 0 20px 0">
                       <ul class="fix" id="mobilecard-select">
						 	<li data-value="szx" class="">
								<a href="javascript:void(0)">移动充值卡</a> <i class="ico_p_cho"></i>
							</li>
						 	<li data-value="lt">
								<a href="javascript:void(0)">联通充值卡</a> <i class="ico_p_cho"></i>
							</li>
						 	<li data-value="dx">
								<a href="javascript:void(0)">电信充值卡</a> <i class="ico_p_cho"></i>
							</li>
						</ul>
					   </div>
                		<label>购买时长</label>
                		<div class="drop_list selected">
                			<a href="javascript:void(0)" class="sel_box" id="mobilecard-selected">
                				<span> </span><i class="ico_p_more"></i>
                			</a>
                			<div class="drop_list_cho" id="mobielcard-drop" style="z-index: 100;">
                				<!-- <a href="#">15元，开通1个月</a>
                				<a href="#">30元，开通2个月</a> -->
                			</div>
                		</div>
                		<script id="mobilecard-template" type="text/template">
						<% for(var i = 0,length = timeList.length ; i < length ; ++i){ %>
							<a href="javascript:void(0)"  data-item="<%= timeList[i].month %>"><%= timeList[i].money %>元，开通<%= timeList[i].month %>个月</a>
						 <% } %>
					</script>

                	</div>
                <!--手机充值卡end-->


				<div class="pay_way_show" id="other-pay-div" style="display:block;">
					<div class="pay_com">
						<div class="btn_wp">
							<a id="sure" href="{{url('/home/vip/pay')}}/{{session('master') -> id}}" target="_blank" class="btn_p_pay" id="pay-btn" clickid="v_pc_minipay_zfbkt">确定开通</a>
						</div>
						<p class="agree"><i name="agree-service" class="ico_radio checked"></i><a href="http://vip.xunlei.com/tos.html" target="_blank">同意并授权服务条款</a></p>
					</div>
				</div>
			</div>
		</div>

		<div class="pay_box hidebox" id="auto-pay-box" style="display:block">
			<div class="pay_way">

			</div>
		</div>
	</div>
	</div>

	<!--结果显示-->
		<div class="pop_state" id="sucess-result-div" style="display:none">
			<div class="pay_state"> <i class="ico_ok_blue"></i>
				<p class="txt_state">您已成功支付白金会员</p>
			</div>
			<div class="user_info">
				<p><span>（注：会员身份将在2小时内生效）</span></p>
			 	<p>帐号：<span id="xlcount"></span></p>

			</div>
			<p class="tip">绑定手机/邮箱，便于找回密码，保护账户安全</p>
			<div class="btn_pay_wp">
				<a href="http://aq.xunlei.com/account_index.html" class="btn_p_pay" target="_blank">绑定手机/邮箱</a>
			</div>
			<div class="poster_wp mt30">
			<div class="poster">
				<div class="img_wp">
					<img src="http://img.vip.xunlei.com/img/banner/201608101834122175.jpg" alt="大福利：免费得1年白金会员！" width="140" height="120"></div>
			</div>
			<div class="cont">
				<p class="tit">大福利：免费得1年白金会员！</p>
				<p class="txt">现在参与理财活动，免费得7天+1年白金会员，到期再提现5元现金！</p>
				<p class="link">
					<a href="http://act.vip.xunlei.com/vip/finance/junxiang/index.html?referfrom=v_pc_hygw_paidtips" target="_blank">查看详情&gt;&gt;</a>
				</p>
			</div>
		</div>
		</div>


	<a href="javascript:void(0)" class="pop_close" style="display: inline;" id="pop_close" clickid="v_pc_minipay_guanbi" title="关闭">关闭</a>
	<a href="javascript:void(0)" title="帮助" class="ico_pay_help" clickid="v_pc_minipay_help">帮助</a>
</div>

<form name="myorderform" id="myorderform" method="post" action="" target="_blank">
<input name="po_way" id="po_way" value="supercode" type="hidden">
<input name="po_source" id="po_source" type="hidden">
<input name="po_month" id="po_month" value="1" type="hidden">
<input name="po_cash" id="po_cash" value="" type="hidden">
<input name="po_ext1" id="po_ext1" type="hidden">
<input name="po_ext2" id="po_ext2" type="hidden">
<input name="po_ext4" id="po_ext4" type="hidden">
<input name="po_ext5" id="po_ext5" type="hidden"> <!-- 自定义数据 -->
<input name="po_active" id="po_active" value="vipsuper" type="hidden">
<input name="po_taocan" id="po_taocan" value="1" type="hidden">
<input name="po_service" id="po_service" value="5" type="hidden">
<input name="po_vastype" id="po_vastype" value="" type="hidden">
<input name="po_uptype" id="po_uptype" value="super" type="hidden">
<!-- fix value -->
<input name="po_waytype" value="" type="hidden">
<input name="po_ispresent" value="0" type="hidden">
<input name="po_presentxlid" value="" type="hidden">
<input name="po_autodeduct" value="0" type="hidden">
<input name="po_extmoney" id="po_extmoney" value="30.0" type="hidden">
<input name="po_extdays" id="po_extdays" value="0" type="hidden">
<input name="po_data3" id="po_data3" value="" type="hidden">
<input name="po_data4" id="po_data4" value="" type="hidden">
<input name="referfrom" id="referfrom" value="v_pc_hygw_ggong_pay_nav" type="hidden">
<input name="aidfrom" id="aidform" value="minipay_zfhz" type="hidden">
<input name="po_cachetime" id="po_cachetime" value="" type="hidden">
<input name="po_userid" id="po_userid" value="175988747" type="hidden">
<input name="po_recommend" id="po_recommend" value="13554" type="hidden">
<input name="po_pricetype" id="po_pricetype" value="0" type="hidden">
<input name="po_ver" id="po_ver" value="2.1.4" type="hidden">
<input name="po_platform" id="po_platform" value="pc" type="hidden">
<!-- 版本 -->
</form>

<div class="xl_pop_tips" style="display:none" id="confirmpop">
	<div class="pop_pay_result">
		<h3 id="querymsgtitle">请您在新打开的页面完成支付！</h3>
		<ul>
			<li><span>•</span>支付完成前请不要关闭此窗口</li>
			<li><span>•</span>支付失败时，可以迅速联系迅雷客服（400-1111-000）</li>
		</ul>
		<div class="btn_wp">
			<a href="javascript:void(0)" class="btn_p_pay" id="query-order-btn">支付成功</a>
			<a href="javascript:void(0)" class="btn_p_pay btn_other close">支付失败</a>
		</div>
	</div>
</div>

<!--alert 弹窗-->
<div class="xl_pop_alert" style="display:none" id="alert-pop">
	<div class="pop_alert_text">
		<h3>请您在新打开的页面完成支付！</h3>
		<div class="btn_wp">
			<a href="javascript:void(0)" class="btn_p_pay close" id="alert-close-btn">关闭</a>
		</div>
	</div>
</div>


<div style="display:none;">
<div style="display:none"><a href="http://tongji.baidu.com/hm-web/welcome/ico?s=be94a17b28798d3dc61eb511641cdd9a" target="_blank"></a></div>
</div>





@endsection